{extend name='user/public/layout' /}
{block name='content'}
<style>
    .but18{margin:0 0 0 150px;color:#fff;cursor:pointer;}
</style>
<div class="overflow_h">
    <div class="screen">
        <div class="screen_box01 overflow_h">
            <ul>
                <li><a href="{:url('user.account/info')}" class="on">基本信息</a></li>
                <li><a href="{:url('user.account/password')}">修改密码</a></li>
                <li><a href="{:url('user.account/bind')}">绑定设置</a></li>
            </ul>
        </div>
    </div>
    <div class="user-nav">
        <form action="{:url('user.account/infoDo')}" method="post" enctype="multipart/form-data">
            <div class="centent_right rightCon">

                <div id="box">
                    <div class="itemCon userinfo" id="infodiv" style="display: block;">
                        <div class="topIntro"><span class="blue">亲爱的{$userInfo.username}</span>, 填写真实资料我们会妥善保管您的信息，我们还会为您提供个性的区域服务，您参加{$site.title}各类活动时，我们能够更方便地与您取得联系</div>
                        <ul class="formList width2 list_mp">
                            <li>
                                <label>用户类型：</label>
                                {$userInfo.model}
                            </li>
                            <li>
                                <label for="city">所在城市：</label>
                                <select name="city" id="city" class="inputStyle width2">
                                    {volist name='cityTree' id='vo'}
                                    <option value="{$vo.id}" {if condition="$vo.id eq $userInfo.city"}selected{/if}>{$vo.name}</option>
                                    {/volist}
                                </select>
                            </li>
                            <li>
                                <label>用户名：</label>
                                <input type="text" value="{$userInfo.username}" disabled="disabled" class="inputStyle" id="username">
                            </li>
                            <li style="height: 100px;">
                                <label>当前头像：</label>
                                <img style="width: 100px;height: 90px;" src="{$userInfo.headimgurl}">
                            </li>
                            <li>
                                <label>上传头像：</label>
                                <input name="img" type="file">
                            </li>
                            <li>
                                <label>昵称：</label><input type="text" value="{$userInfo.nickname}" class="inputStyle width2" name="nickname" >
                            </li>
                            <li>
                                <label>真实姓名：</label><input type="text" value="{$userInfo.userInfo.truename}" class="inputStyle width2" name="data[truename]" >
                                <span class="tip" id="nicknameTip">4-20个字符</span>
                            </li>
                            <li>
                                <label>性别：</label>
                                <div class="radioBox">
                                    <label>
                                        <input type="radio" {if condition="$userInfo.userInfo.sex eq '男'"}checked {/if} value="男" name="data[sex]">
                                        男</label>
                                    <label>
                                        <input type="radio" {if condition="$userInfo.userInfo.sex eq '女'"}checked {/if} value="女" name="data[sex]">
                                        女</label>
                                </div>
                            </li>
                            <li>
                                <label>生日：</label>
                                <input type="text" name="data[birthday]" onclick="myCalendar();" value="{$userInfo.userInfo.birthday}" class="inputStyle">
                            </li>
                            <li>
                                <label>证件类型：</label>
                                <select id="selectIDType" name="code_type" class="selectStyle">
                                    <option value="">身份证</option>
                                </select>
                            </li>
                            <li>
                                <label>证件号码：</label><input type="text" name="data[bodycode]" value="{$userInfo.userInfo.bodycode}" class="inputStyle" id="idcode"></li>
                            <li id="cardbox" {notempty name="userInfo.cardimg"}style="height:115px;"{/notempty}>
                                <label>证件图片：</label>
                                <div>
                                    <img src="{$userInfo.cardimg}" alt="" id="cardimg_src" height="80">
                                </div>
                                <input type="hidden" name="cardimg" id="cardimg" class="input-text fl mr10" value="" size="50">
                                <div id="cardimg_upload" class="but18 btn_submit" onclick="ajaxUpload('cardimg_upload','cardimg');"><span>上传</span></div>
                            </li>
                            <li>
                                <label>公司名称：</label><input name="company" style="width: 300px;" type="text" value="{$userInfo.company}" class="inputStyle" ></li>
                            <li>
                                <label>购房热线：</label><input type="text" name="buy_phone" value="{$userInfo.buy_phone}" class="inputStyle" ></li>

                            <li>
                                <label>联系qq：</label>
                                <input type="text" name="data[qq]" value="{$userInfo.userInfo.qq}" class="inputStyle">
                            </li>
                            <li>
                                <label>联系地址：</label>
                                <input type="text" name="data[address]" value="{$userInfo.userInfo.address}" class="inputStyle">
                            </li>
                            <input type="hidden" name="id" value="{$userInfo.id}">
                        </ul>
                    </div>

                </div>
                <div id="btnStyle" style="display: block;">
                    <ul class="formList width2">
                        <li>
                            <label>&nbsp;</label>
                            <input class="btnStyle" value="确 定" type="submit">
                        </li>
                    </ul>
                </div>
            </div>
        </form>

    </div>
</div>
<script src="__PUBLIC__/js/calendar/WdatePicker.js"></script>
<script src="__PUBLIC__/js/plugins/fileuploader.js"></script>
<script>
    function myCalendar(id){
        WdatePicker({dateFmt:'MM-dd',el:id});
    }
    function ajaxUpload(btn,input){
        //上传图片

        var img_uploader = new qq.FileUploaderBasic({
            allowedExtensions: ['jpg','gif','jpeg','png','swf'],
            button: document.getElementById(btn),
            multiple: false,
            action: "{:url('ajaxUploadImg')}",
            inputName: 'img',
            forceMultipart: true, //用$_FILES
            messages: {
                typeError: "{file} 文件类型不符合: {extensions}.",
                sizeError: "{file} 太大了, 最大不超过 {sizeLimit}.",
                minSizeError: "{file} is too small, minimum file size is {minSizeLimit}.",
                emptyError: "{file} is empty, please select files again without it.",
                noFilesError: "No files to upload.",
                onLeave: "The files are being uploaded, if you leave now the upload will be cancelled."
            },
            showMessage: function(message){
                layer.msg(message,{icon:2});
            },
            onSubmit: function(id, fileName){
                $('#'+btn).addClass('btn_disabled').find('span').text('上传中，请稍候...');
            },
            onComplete: function(id, fileName, result){
                $('#'+btn).removeClass('btn_disabled').find('span').text('上传');
                if(result.status == '1'){
                    $('#cardbox').css({height:'115px'});
                    $('#'+input).val(result.data);
                    $('#'+input+'_src').attr('src',result.data);
                } else {
                    layer.msg(result.msg,{icon:2});
                }
            }
        });
    }
</script>
{/block}